<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
    <!--1.form代表整个表单 action属性表示收集好数据提交的地址，
        #占位符表示提交到当前页-->
    <form action="#">
        <!--2.表单里可以写各种表单控件，如:输入框、单选、多选等
        type 的值：
        text 普通文本输入框
        submit 提交按钮 reset重置按钮 button普通按钮
        data 日期 color 颜色选择器 range 范围 file文件上传-->
        姓名:<input type="text" name="uname" placeholder="请输入姓名"><br>
        <!--value value属性本来就存在，用来保存控件的值，也可以通过value属性设置输入框的默认值-->
        昵称:<input type="text" name="nickname1" value="rose"><br>
        <!--readonly 只读 只能看 不能改 可以提交数据-->
        昵称:<input type="text" name="nickname2" value="rose" readonly><br>
        <!--disabled 禁用 可以看到值 但做不了任何操作 数据也无法提交-->
        昵称:<input type="text" name="nickname3" value="rose" disabled><br>
        <!--maxlength 设置输入框的最大输入长度-->
        密码:<input type="password" maxlength="6" value="123456" name="upwd"><br>
        <!--单选框必须设置相同的name分到同一组！
        且需要给每个选项设置value值，否则提交的是on
        checked设置选项被默认选中-->
        性别:
        <input type="radio" name="gender" value="1">男
        <input type="radio" name="gender" value="0">女
        <br>
        </input type="submit">
        爱好:
        <input type="checkbox" name="like" value="cy">抽烟
        <input type="checkbox" name="like" value="hj">喝酒
        <input type="checkbox" name="like" value="tt">烫头
        <input type="checkbox" name="like" value="java">学java
        <br>
        生日:<input type="date" name="birthday"><br>
        幸运色:<input type="color" name="lColor"><br>
        缩放:<input type="range" name="scale"><br>
        文件:<input type="file" name="file"><br>
        <hr>
        喜欢的城市:
        <select name="city">
            <option value="beijing">北京</option>
            <option value="shanghai" selected>上海</option>
            <option value="shenzhen">深圳</option>
            <option value="hangzhou">杭州</option>
        </select>
        <br>
        <input type="checkbox" id="ok">
        <label for="ok">我已阅读并同意</label>
        <br>
        <label for="uu">关联文字</label>
        <input type="text" id="uu">
        <hr>
        <input type="submit" value="点我提交">
        <input type="reset" value="点我重置">
        <input type="button" value="普通按钮">
        <button>普通按钮</button>
    </form>
</body>
</html>

















